<template>
  <div class="about">
    <h1>{{ name }}</h1>
    <button @click="change('迪丽热巴')">修改name</button>

    <!-- 展示 modulesa里的数据 -->
    <h1>{{ arr }}</h1>
    <button @click="add">向数组里添加</button>
  </div>
</template>
<script>
import { mapState, mapMutations } from "vuex";
export default {
  data() {
    return {};
  },

  computed: {
    // name() {
    //   return this.$store.state.name;
    // },

    ...mapState(["name", "age"]),

    arr() {
      return this.$store.state.a.arr;
    },
  },
  methods: {
    // change() {
    //   this.$store.commit("change")
    // },
    ...mapMutations(["change"]),
    //调用mutation修改name

    add() {
      this.$store.commit("a/add");
    },
  },
};
</script>
